<template>
    <view class="identityPage">
		<text class="title">{{title}}</text>
		<block v-if="infos.census === 'huYes'">
			<view class="selectGroup">
				<block v-for="(item,index) in selects" :key="index">
					<view class="selBtn flex" @click="changeSel(item.type)">
						<text></text>
						{{item.title}}
						<up-icon name="arrow-right" color="#007235" size="8"></up-icon>
					</view>
				</block>
			</view>
		</block>
		
		<block v-if="infos.houseFirst === false">
			<view class="selectGroup">
				<block v-for="(item,index) in secHouseList" :key="index">
					<view class="selBtn flex" @click="changeSel(item.type)">
						<text></text>
						{{item.title}}
						<up-icon name="arrow-right" color="#007235" size="16"></up-icon>
					</view>
				</block>
			</view>
		</block>
		
		<up-modal :show="showModelTxt" :closeOnClickOverlay="true" @close="showModelTxt=false" @confirm="showModelTxt=false">
			<view class="slot-content">
				<view class="contentWrap flex"  v-if="titList.length > 0">
					<view class="txtWrap flex bg-theme text-center col-fff font20 fontBold">
						<view>
							<view v-for="(item, index) in titList" :key="index">{{ item }}</view>
						</view>
					</view>
				</view>
				<view class="restrictionBg" :class="restrictHouse" v-else></view>
			</view>
		</up-modal>
    </view>
</template>

<script>
	export default {
        data() {
            return {
				title: "您名下是否单独拥有房屋?",
				infos: {},
				restrictHouse: "",
				selects: [
					{
						title: '本人名下一套房',
						type: 'singleYes'
					},
					{
						title: '本人名下两套房及以上',
						type: 'singleNo'
					},
					{
						title: '本人名下无房',
						type: 'familyNo'
					},
					{
						title: '与父母共同拥有房屋',
						type: 'familyYes'
					}
				],
				secHouseList: [
					{
						title: '沪籍的人上产证',
						type: 'certificateYes'
					},
					{
						title: '沪籍的人不上产证',
						type: 'certificateNo'
					}
				],
				showModelTxt: false,
				titList: []
            }
        },
        //分享
        onShareAppMessage(res) {
        	return {
        		title: "上海限购查询，快来测测限购几套",
        		path: `/pages/tools/purchase/identity`,
        	}
        },
        onLoad(options){
            this.infos = JSON.parse(options.info);
			if(this.infos.houseFirst === false){
				this.title = "夫妻当中沪籍的一方是否有一个上产证?"
			}
        },
		methods:{
			//选择sel
			changeSel(type){
				switch(type){
					case "singleYes":
					this.titList = ['外环外不限购','外环内可再购1套'];
					this.showModelTxt = true;
					break;

					case "singleNo":
					this.restrictHouse = "restrictionNone",
					this.titList = [];
					this.showModelTxt = true;
					break;

					case "familyYes":
					this.infos.select = type;
					uni.navigateTo({
						url: `/pages/tools/purchase/hu-single-family-has-house?info=${JSON.stringify(this.infos)}`
					})
					break;

					case "familyNo":
					this.titList = ['外环外不限购','外环内限购两套'];
					this.showModelTxt = true;
					break;

					case "certificateYes":
					this.titList = ['外环外不限购','外环内可再购1套'];
					this.showModelTxt = true;
					break;

					case "certificateNo":
					this.infos.pageName = 'certificateNo';
					uni.navigateTo({
						url: `/pages/tools/purchase/social-security?info=${JSON.stringify(this.infos)}`
					})
					break;

					default:
					break
				}
			}
		}
    }
</script>

<style scoped lang="scss">
	.identityPage{
		text-align: center;
		::v-deep .u-modal__content{
            padding: 0 !important;
            display: block !important;
        }
		.title{
			margin-top: 20vh;
			font-size: 40rpx;
			display: block;
		}
		.selBtn{
			font-size: 32rpx;
			height: 70rpx;
			justify-content: space-between;
			border: 1rpx solid $theme-color;
			color: $theme-color;
			border-radius: 10rpx;
			margin-top: 40rpx;
		}
		.selectGroup{
			padding: 0 40rpx;
		}
		.contentWrap{
			padding: 40rpx 0;
			.txtWrap{
				padding: 20rpx;
				width: 40vw;
				height: 40vw;
				line-height: 1.4;
				border-radius: 50%;
			}
			.pangFigure{
				width: 40vw;
				margin-left: -64rpx;
			}
		}
	}
</style>
